<template>
  <div class="slide-image" style="border-radius: 4px">
    <el-carousel :key="'carouselList'" trigger="click" arrow="always" height="350px" :autoplay="false" style="border-radius: 5px">
      <el-carousel-item v-for="item in carouselList" :key="item.id">
        <div class="img-detail" @click="toTarget(item.target)">
          <el-image :src="item.cover | filterImg" fit="fill">
            <div slot="error" class="image-slot">
              <i class="el-icon-picture-outline"></i>
            </div>
          </el-image>
        </div>
      </el-carousel-item>
<!--      <el-carousel-item>-->
<!--        <div class="img-detail">-->
<!--          <el-image :src="require('../assets/image/carousel2.jpg')" fit="fill"></el-image>-->
<!--        </div>-->
<!--      </el-carousel-item>-->
<!--      <el-carousel-item>-->
<!--        <div class="img-detail">-->
<!--          <el-image :src="require('../assets/image/carousel3.jpg')" fit="fill"></el-image>-->
<!--        </div>-->
<!--      </el-carousel-item>-->
<!--      <el-carousel-item>-->
<!--        <div class="img-detail">-->
<!--          <el-image :src="require('../assets/image/carousel4.jpg')" fit="fill"></el-image>-->
<!--        </div>-->
<!--      </el-carousel-item>-->
<!--      <el-carousel-item>-->
<!--        <div class="img-detail">-->
<!--          <el-image :src="require('../assets/image/carousel5.jpg')" fit="fill"></el-image>-->
<!--        </div>-->
<!--      </el-carousel-item>-->
<!--      <el-carousel-item>-->
<!--        <div class="img-detail">-->
<!--          <el-image :src="require('../assets/image/carousel6.jpg')" fit="fill"></el-image>-->
<!--        </div>-->
<!--      </el-carousel-item>-->
    </el-carousel>
  </div>
</template>

<script>
export default {
  name: "SlideImage",
  props: {
    carouselList: []
  },
  data() {
    return {}
  },
  methods:{
    toTarget(href){
      window.open(href,'_blank')
    }
  },
  created() {
  }
}
</script>

<style scoped>

.slide-image .el-image {
  width: 100%;
  height: 350px;
}
</style>
